<template>
	<view class="login_box">
		<view class="login">
			<image src="../static/login.png"></image>
			<text class="login_one">未登录</text>
			<text class="login_two">立即登录</text>
		</view>
		<view class="searchBox">
			<image src="../static/放大镜.png"></image>
			<navigator url="/pages/song/song" hover-class="none">
				<input  class="search" type="text" placeholder="搜索歌曲"/>
			</navigator>
		</view>
	</view>
</template>

<script>
</script>

<style>
	.login {
		padding: 10rpx 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.login image {
		width: 50rpx;
		height: 50rpx;
		border-radius: 50%;
	}

	.login text {
		font-size: 20rpx;
		margin-left: 20rpx;
		color: #666;
	}

	.login_one {
		margin-right: 400rpx;
	}

	.login .login_two {
		width: 100rpx;
		padding: 0 5px;
		border: 1px solid #999;
		border-radius: 50rpx;
		color: #111;
	}

	.login button {
		width: 120rpx;
		height: 50rpx;
		font-size: 14rpx;
	}
	navigator{
		width: 590rpx;
	}
	.search{
		padding: 10rpx 60rpx;
		width: 590rpx;
		margin: auto;
		background-color: #eee;
		border-radius: 35rpx;
	}
	.searchBox{
		position: relative;
		margin-top: 5rpx;
		padding: 0 20rpx;
	}
	.searchBox image{
		width: 30rpx;
		height: 30rpx;
		position: absolute;
		top: 20rpx;
		left: 40rpx;
	}
</style>
